<template>
  <view class="contents"   @click='handleClick(data)' >
    <view class="title">
      {{ data.name }}
      <!-- <u-icon class='iconleft' name="arrow-right-double" size="28"></u-icon> -->
      <view class="iconleft" style="color: #ffffff">
        <text style="margin-right:10rpx;">设备数量:</text>
        {{ data.deviceNum }}
      </view>
    </view>
    <!-- <view class="lineInCard"></view> -->
    <view class="detail">
      <view class="time">
        <image src="../../static/images/system.png" class="imageBg" />
        <view class="text">系统：{{ data.system }}</view>
      </view>
      <!-- <view class=""> 所在地区：{{ data.position }} </view> -->
      <view class="time">
        <image src="../../static/images/time.png" class="imageBg" />

        <view class="text">开始时间：{{ data.startTime }}</view>
      </view>
      <view class="time">
        <image src="../../static/images/time.png" class="imageBg" />
        <view class="text">结束时间：{{ data.endTime }}</view>
      </view>
      <!-- <view class=""> 点检人：{{ data.nickName }} </view> -->
    </view>
<view class="bottombox" @click.stop='allimage(data)' > 
  <text class="sumarry" style="font-size:20rpx;">汇总表</text>
</view>
<view class="bottombox1" @click.stop='handleClick(data)'  > 
 <text style="font-size:20rpx">详情</text>
</view>
  </view>
</template>
<script>
export default {
  props: {
    data: {
      type: Object,
      default: 0
    },
    status: {
      type: String,
      default: 0
    }
  },
  data() {
    return {
      remark: ''
    }
  },
  methods: {
    handleClick(data) {
      const timeone = data.startTime.split(' ')[0]
      const timetwo = data.startTime.split(' ')[1]
      const hour = timetwo.split(':')[0]
      const minute = timetwo.split(':')[1]
      const second = timetwo.split(':')[2]
      uni.navigateTo({
        url:
          '/pages/product/product?data=' +
          data.id +
          '&timeone=' +
          timeone +
          '&hour=' +
          hour +
          '&minute=' +
          minute +
          '&second=' +
          second
      })
    },
    allimage(data){
      console.log(data)
      uni.navigateTo({
                  url: "/pages/preview/summary?data=" +data.id
                });
    }
  }
}
</script>

<style lang="scss" scoped>
.contents {
  position: relative;
  margin-bottom: 20rpx;
  background-color: white;
  padding: 20rpx 20rpx 100rpx 20rpx;
  background: #ffffff;
  border: 1px solid #eee;
  border-radius: 16rpx;
  box-shadow: 0 0 20rpx #eee;
  .title {
    font-size: 34rpx;
    font-weight: 600;
    margin-bottom: 10rpx;
    color: #333333;
    .iconleft {
      font-size: 22rpx;
      position: absolute;
      right: 0;
      top: 0;
      font-weight: 500;
      padding: 0rpx 30rpx;
      border-bottom-left-radius: 100rpx;
      border-top-right-radius: 32rpx;
      background: linear-gradient(-34deg, #1040be, #026dff);
      // margin-top: 4rpx;
    }
  }

  .detail {
    padding-top: 5px;
    padding-bottom: 5px;

    margin: 0px 30rpx 0px 0px;
    color: #717171;
    .time {
      display: flex;
      margin-bottom: 20rpx;

      .imageBg {
        width: 25rpx;
        height: 25rpx;
        margin-right: 5rpx;
        padding: 4rpx;
      }
      .text {
        line-height: 30rpx;
        font-size: 24rpx;
      }
    }
  }

  .bottom {
    padding-top: 10rpx;
    color: #111111;
  }
}
.bottombox {
  margin-top: 15rpx;
  width:100%;
  height: 50rpx;
  position:absolute;
  background-color: rgba(16,91,245,74%);
  border-radius: 20px;
  color:white;
  width: 170rpx;
  display:flex;
  align-items:center;    /*垂直居中 */
 	justify-content:center;  
  right: 35%;
}
.bottombox1 {
   margin-top: 15rpx;
 width:100%;
  height: 50rpx;
  position:absolute;
  background-color: rgba(16,91,245,74%);
  border-radius: 20px;
  color:white;
  width: 170rpx;
  display:flex;
  align-items:center;    /*垂直居中 */
 	justify-content:center;  
  right: 5%;
}
/deep/ .allimage {
  margin: 30rpx 30rpx;
  width: 80% !important;
  height: 80% !important
}
</style>
